<template>
    <view class="attributeItem-box">
        <image v-if="props.title == '联系人'" class="icon" src="@/static/contactInformation/ic_lxr.png" mode="widthFix">
        </image>
        <image v-else-if="props.title == '电话'" class="icon" src="@/static/contactInformation/ic_dh.png" mode="widthFix">
        </image>
        <image v-else-if="props.title == '地址'" class="icon" src="@/static/contactInformation/ic_dz.png" mode="widthFix">
        </image>
        <image v-else-if="props.title == '邮箱'" class="icon" src="@/static/contactInformation/ic_yx.png" mode="widthFix">
        </image>
        <text class="title">{{ props.title + '：' }}</text>
        <text class="desc" selectable>{{ props.desc }}</text>
    </view>
</template>
<script setup>


const props = defineProps({
    title: {
        type: String,
        default: () => {
            return '--'
        }
    },
    desc: {
        type: String,
        default: () => {
            return '--'
        }
    }
})


</script>
<style lang="scss" scoped>
.attributeItem-box {
    width: 710rpx;
    display: flex;
    margin: auto auto 23rpx;
    flex-direction: row;
    align-items: center;

    .icon {
        height: 34rpx;
        width: 34rpx;
        display: block;
    }

    .title {
        margin-left: 10rpx;
        font-size: 28rpx;
        white-space: nowrap;
        color: #717171;
    }

    .desc {
        font-size: 28rpx;
        color: #1D161F;
    }
}
</style>